<template>
  <div>
    <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
      <el-row gutter="15">
        <el-col :span="12">
          <el-form-item label="身份证号" prop="patient_idcard1">
            <el-input v-model="formData.patient_idcard1" placeholder="请输入身份证号" clearable
                      :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label-width="123px" label="" prop="field123">
            <el-button
              type="warning"
              plain
              icon="el-icon-edit"
              size="medium"
              @click="handleUpdate"
              v-hasPermi="['system:patient:edit']"
            > 加载身份证号 </el-button>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label-width="1px" label="" prop="field124">
            <el-button
              type="primary"
              icon="el-icon-search"
              size="success"
              @click="submitForm"
              v-hasPermi="['system:patient:add']"
            > 提交患者 </el-button>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row gutter="15">
        <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-col :span="6">
          <el-form-item label="身份证号" prop="patientIdcard">
            <el-input v-model="form.patientIdcard" placeholder="请输入患者身份证" clearable
                      :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="患者姓名" prop="patientName">
            <el-input v-model="form.patientName" placeholder="请输入患者姓名" clearable
                      :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="患者电话" prop="patientPhone">
            <el-input v-model="form.patientPhone" placeholder="请输入患者电话" clearable
                      :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="出生日期" prop="patientBirth">
            <el-date-picker v-model="form.patientBirth"
                            format="yyyy-MM-dd"
                            value-format="yyyy-MM-dd"
                            :style="{width: '100%'}"
                            placeholder="请选择出生日期"
                            type="date"
                            clearable></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="患者年龄" prop="patientAge">
            <el-input v-model="form.patientAge" placeholder="请输入患者年龄" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label-width="-7px" label="患者性别" prop="patientSex">
            <el-radio-group v-model="form.patientSex" size="medium">
              <el-radio
                v-for="dict in sexOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"

              ></el-radio>
<!--              <el-option label="请选择字典生成" value="patient_sexOptions" />-->
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="地址信息" prop="patientAddr">
            <el-input v-model="form.patientAddr" placeholder="请输入地址信息" clearable
                      :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
          <el-col :span="6">
            <el-form-item label="患者ID" prop="patientId">
              <el-input v-model="form.patientId" placeholder="请输入患者年龄" clearable :style="{width: '100%'}" :disabled="true">
              </el-input>
            </el-form-item>
          </el-col>
        </el-form>
      </el-row>



      <el-row gutter="15">
        <el-col :span="12">
          <el-form-item label-width="1px" label="" prop="field133">
            <el-radio-group v-model="radio23" size="medium">
              <el-radio-button
                v-for="dict in outpatient_register_type"
                :key="dict.registerCost"
                :label="dict.registerType"
                :value="dict.registerCost"
                name="isiis"
              ></el-radio-button>
            </el-radio-group>
          </el-form-item>
        </el-col>
<!--        {{this.ssse}}-->
        <el-col :span="12">
            <el-form-item label-width="450px" label="" prop="field134">
<!--              <span v-if="this.radio23!=null">-->
<!--              <span v-for="dict in outpatient_register_type">-->
<!--                <p v-if="this.radio23==dict.registerType">共计{{dict.registerCost}}</p>-->
<!--              </span>-->
<!--              </span>-->
              <el-button
                type="danger"
                round
                icon="el-icon-edit"
                size="medium"
                @click="hzbForm"
                v-hasPermi="['system:registerghd:add']"
              > 挂号收费 </el-button>
            </el-form-item>

        </el-col>
      </el-row>

<!--      科室挂号数量-->
      <el-row gutter="15">
        <div class="app-container">
          <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
            <el-form-item label="科室名称" prop="deptName">
              <el-input
                v-model="queryParams.deptName"
                placeholder="请输入科室名称"
                clearable
                size="small"
                @keyup.enter.native="handleQuery"
              />
            </el-form-item>
            <el-form-item label="选择科室" prop="deptid">
            <el-select v-model="value" placeholder="请选择科室">
              <el-option
                v-for="dict in copy1List"
                :key="dict.deptId"
                :label="dict.deptName"
                :value="dict.deptId">
              </el-option>
            </el-select>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery2">搜索</el-button>
              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery2">重置</el-button>
            </el-form-item>
          </el-form>


          <el-table v-loading="loading" :data="copy1List" @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="科室ID" align="center" prop="deptId" />
            <el-table-column label="科室名称" align="center" prop="deptName" />
            <el-table-column label="数量" align="center" prop="deptSs" />
          </el-table>

          <pagination
            v-show="total>0"
            :total="total"
            :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize"
            @pagination="getList"
          />

          <!-- 添加或修改科室对话框 -->
          <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
              <el-form-item label="科室名称" prop="deptName">
                <el-input v-model="form.deptName" placeholder="请输入科室名称" />
              </el-form-item>
              <el-form-item label="数量" prop="deptSs">
                <el-input v-model="form.deptSs" placeholder="请输入数量" />
              </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
              <el-button type="primary" @click="submitForm">确 定</el-button>
              <el-button @click="cancel">取 消</el-button>
            </div>
          </el-dialog>
        </div>
      </el-row>
    </el-form>
  </div>
</template>
<script>
  // import { listCopy } from "@/api/syl_DZ/D/OutpatientPatient/copy1";
  import {addRegister,addCopy1,listCopy,getPatient,listTypegh} from "@/api/syl_DZ/D/OutpatientPatient/copy1";


  export default {
    name: "Copy1",
    components: {},
    props: [],
    data() {
      return {
        ssse: null,
        radio23:null,
        formData: {
          patient_idcard1: undefined,
          field123: '',
          field124: undefined,
          patient_idcard: undefined,
          patient_name: undefined,
          patient_phone: undefined,
          patient_birth: null,
          patient_age: undefined,
          patient_sex: undefined,
          patient_addr: undefined,
          field133: undefined,
          field134: undefined,
        },
        //   queryParams: {
        //   pageNum: 1,
        //   pageSize: 10,
        //   patientName: null,
        //   patientSex: null,
        //   patientIdcard: null,
        //   patientAge: null,
        //   patientPhone: null,
        //   patientAddr: null,
        //   patientBirth: null,
        //   patientAlle: null,
        // },
                // 表单参数
        form: {},
        reset() {
          this.form = {
            patientId: null,
            patientName: null,
            patientSex: null,
            patientIdcard: null,
            patientAge: null,
            patientPhone: null,
            patientAddr: null,
            patientBirth: null,
            patientAlle: null,
            register_type:null,
            createBy: null,
            createTime: null,
            updateBy: null,
            updateTime: null,
            remark: null
          };
          this.resetForm("form");
        },
            /** 新增按钮操作 */
          handleAdd() {
            this.reset();
          },

        rules: {
          patient_idcard1: [],
          patient_idcard: [{
            required: true,
            message: '请输入身份证号',
            trigger: 'blur'
          }],
          patient_name: [],
          patient_phone: [],
          patient_birth: [],
          patient_age: [],
          patient_sex: [],
          patient_addr: [],
          field133: [{
            required: true,
            message: '不能为空',
            trigger: 'change'
          }],
        },

        form123 :{
          registerId: null,
          patientId: null,
          doctorId: null,
          deptId: null,
          registerSort: null,
          registerType: null,
          registerSubsectionTime: null,
          registerTime: null,
          turnoverId: null,
          registerCost: null,
          costStatus: "0",
          outpatientStatus: "0",
          createBy: null,
          createTime: null,
          updateBy: null,
          updateTime: null,
          remark: null
        },

        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 科室表格数据
        copy1List: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        // 性别状态字典
        sexOptions: [],
        // 门诊价格和类型
        outpatient_register_type: [],
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          deptName: null,
          deptSs: null,
          registerType: null,
          registerCost: null,
          status: null
        },
        // 查询参数
        queryParamsbz: {
          pageNum: 1,
          pageSize: 10,
          deptName: null,
          deptSs: null
        },
        // 表单校验
        rules: {
          deptName: [
            { required: true, message: "科室名称不能为空", trigger: "blur" }
          ],
        }


      }
    },
    computed: {},
    watch: {},
    created() {

      this.getDicts("sys_user_sex").then(response => {
        this.sexOptions = response.data;
      });
      this.getList2();
      this.getList();
      },
    mounted() {},
    methods: {
      panduan(ssse){
        // var lis1 = document.getElementsByTagName("isiis");
        var lis1 = document.getElementsByClassName('el-radio-button el-radio-button--medium is-active');
        console.dir(lis1);

        // this.ssse=box.value;
        // for (i=1;i<5;i++){
        //
        //   if (this.radio23==this.outpatient_register_type[i].registerType){
        //     this.ssse=this.outpatient_register_type[i].registerType
        //   }
        // }


      },

      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.deptId)
        this.single = selection.length!==1
        this.multiple = !selection.length
      },
      //查挂号类型
      getList2() {
        this.loading = true;
        listTypegh().then(response => {
          this.outpatient_register_type = response.rows;
        });
        this.loading = false;
      },
      /** 修改按钮操作 */
      handleUpdate() {
        this.reset();
        const patientId = this.formData.patient_idcard1
        getPatient(patientId).then(response => {
          this.form = response.data;
        });
      },
      /** 查询科室列表 */
      getList() {
        this.loading = true;
        listCopy(this.queryParamsbz).then(response => {
          this.copy1List = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },
      submitForm() {
            if (this.form.patientIdcard != null) {
              addCopy1(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open = false;
                this.getList();
              });
            }},

      hzbForm() {
        this.form123.patientId=this.form.patientId;
        this.form123.deptId=this.value;
        this.form123.registerType=this.radio23;

        addRegister(this.form123).then(response => {
            this.msgSuccess("新增成功");
            this.open = false;
            this.getList();
          });
        },

    } };

</script>
<style scoped>
  .el-row {
    margin: 20px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
    width: 95%;
    align: middle;
  }
</style>
